import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _Tabs from "antd/lib/tabs";

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  width: 100%;\n  height: auto;\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

import memoize from "memoize-one";
import styled from "styled-components";
import React, { useEffect, useState } from "react";
import intl from "cpaas-front/lib/utils/intl";
import { schemaName } from "../../utils/constants";
var TabPane = _Tabs.TabPane; // TODO: 如果有其它语言的静态资源，需要在这里更改

function getCurrentLanguage() {
  // 因为目前只有中文和英文有静态资源，如果是其它语言没有对应的资源，会报错，所以要加这么一个判断
  var languagesHasAssets = ["zh_CN", "en_US"];
  var lang = intl.getInitOptions().currentLocale || "zh_CN";
  return languagesHasAssets.includes(lang) ? lang : "zh_CN";
}
/**
 * 异步获取图片的公用组件
 * @param schema
 * @param dirname
 * @param index
 * @param ext
 * @returns {*}
 * @constructor
 */


function AsyncImage(_ref) {
  var schema = _ref.schema,
      dirname = _ref.dirname,
      index = _ref.index,
      ext = _ref.ext;

  var _useState = useState(""),
      _useState2 = _slicedToArray(_useState, 2),
      src = _useState2[0],
      setSrc = _useState2[1];

  var lang = getCurrentLanguage();
  useEffect(function () {
    import("../_assets/".concat(schema, "/").concat(lang, "/").concat(dirname, "/style").concat(index, ".").concat(ext)).then(function (m) {
      setSrc(m.default);
    });
  }, []);
  return React.createElement("img", {
    src: src,
    alt: ""
  });
}
/**
 * 工具函数：获取记忆化的一个渲染列表，仅当schema改变时重新计算；
 * @param count // 样式数量
 * @param dirname // 子文件夹
 * @param ext // 拓展名
 * @returns {function(*): {render: *}[]}
 */


export function getMemoizedAssets() {
  var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
  var dirname = arguments.length > 1 ? arguments[1] : undefined;
  var ext = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "svg";
  return memoize(function (schema) {
    return Array.from({
      length: count
    }).map(function (v, i) {
      return {
        bottomTitle: i === 0 ? "".concat(schemaName.get(schema), "\u6A21\u5F0F\u4E0B\u63A8\u8350\u4F7F\u7528\u6837\u5F0F\u4E00") : "",
        render: React.createElement(AsyncImage, {
          schema: schema,
          index: i + 1,
          ext: ext,
          dirname: dirname
        })
      };
    });
  });
}
/**
 * 静态图片和gif可以相互转换的组件
 * @param dirname 相对目录
 * @param index 要加载的索引
 * @param _ext 静态图片拓展名
 * @param prefix 前缀，比如style1-2.png 的 1
 * @param schema 当前主题
 * @returns {*}
 * @constructor
 */

function StaticGif(_ref2) {
  var dirname = _ref2.dirname,
      index = _ref2.index,
      _ext = _ref2._ext,
      prefix = _ref2.prefix,
      schema = _ref2.schema;

  var _useState3 = useState(_ext),
      _useState4 = _slicedToArray(_useState3, 2),
      ext = _useState4[0],
      setExt = _useState4[1];

  var lang = getCurrentLanguage();
  return (// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
    React.createElement("img", {
      onMouseOver: function onMouseOver() {
        return setExt("gif");
      },
      onMouseLeave: function onMouseLeave() {
        return setExt(_ext);
      } // eslint-disable-next-line import/no-dynamic-require,global-require
      ,
      src: require("../_assets/".concat(schema, "/").concat(lang, "/").concat(dirname, "/style").concat(prefix ? "".concat(prefix, "-") : "").concat(index + 1, ".").concat(ext)),
      alt: ""
    })
  );
}
/**
 * 获取需要动态转换静态图片和动图的memoized
 * @param count 样式数
 * @param dirname 相对目录名
 * @param ext 拓展名
 * @param prefix 前缀，同上
 * @returns {function(*): {bottomTitle: string, render: *}[]}
 */


export function getStaticGif(count, dirname) {
  var ext = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "png";
  var prefix = arguments.length > 3 ? arguments[3] : undefined;
  return memoize(function (schema) {
    return Array.from({
      length: count
    }).map(function (v, i) {
      return {
        bottomTitle: i === 0 ? "".concat(schemaName.get(schema), "\u6A21\u5F0F\u4E0B\u63A8\u8350\u4F7F\u7528\u6837\u5F0F\u4E00") : "",
        render: React.createElement(StaticGif, {
          schema: schema,
          dirname: dirname,
          index: i,
          _ext: ext,
          prefix: prefix
        })
      };
    });
  });
}
var StyledImg = styled.img(_templateObject()); // 表格展示组件

function TableTab(_ref3) {
  var index = _ref3.index,
      schema = _ref3.schema;

  var _useState5 = useState({}),
      _useState6 = _slicedToArray(_useState5, 2),
      urls = _useState6[0],
      setUrls = _useState6[1];

  var items = ["basic", "form+paging", "operation", "Fixed", "screening", "editor", "folding"];
  var lang = getCurrentLanguage();
  useEffect(function () {
    Promise.all(items.map(function (item) {
      return import("../_assets/".concat(schema, "/").concat(lang, "/table/style").concat(index, "/").concat(item, ".svg"));
    })).then(function (arr) {
      var result = {};
      items.forEach(function (v, i) {
        result[v] = arr[i].default;
      });
      setUrls(result);
    });
  }, [lang]);
  var titles = {
    basic: "基础表格",
    "form+paging": "基础表格(含分页)",
    operation: "带操作列",
    editor: "可行内编辑",
    Fixed: "带固定列",
    screening: "表头可筛选",
    folding: "可折叠"
  };
  return React.createElement(_Tabs, null, items.map(function (v) {
    return React.createElement(TabPane, {
      key: v,
      tab: titles[v]
    }, React.createElement(StyledImg, {
      src: urls[v] || ""
    }));
  }));
} // 获取表格的静态资源


export function getTableStatic(count) {
  return memoize(function (schema) {
    return Array.from({
      length: count
    }).map(function (v, i) {
      return {
        bottomTitle: i === 0 ? "".concat(schemaName.get(schema), "\u6A21\u5F0F\u4E0B\u63A8\u8350\u4F7F\u7528\u6837\u5F0F\u4E00") : "",
        render: React.createElement(TableTab, {
          index: i + 1,
          schema: schema
        })
      };
    });
  });
}
